﻿@model CSEPT.Models.ViewModel
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>CSEPT - @ViewBag.Title</title>
    <link rel="shortcut icon" href="@Url.Content("/favicon.png")" /> 
    <!-- Bootstrap -->
    <link href="@Url.Content("/css/bootstrap.min.css")" rel="stylesheet" />
    <link href="@Url.Content("/css/bootstrap-theme.min.css")" rel="stylesheet" /> 
    <link href="@Url.Content("/css/csept.css")" rel="stylesheet" /> 
    <link href="@Url.Content("/css/datepicker3.css")" rel="stylesheet" /> 
    <link href="@Url.Content("/css/toastr.min.css")" rel="stylesheet" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

    @*<link href="@Url.Content("/css/agency.css")" rel="stylesheet" />*@
    @*<link href="@Url.Content("/css/sb-admin.css")" rel="stylesheet" />*@

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <nav class="navbar navbar-default" role="navigation">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="@Url.Action("Index", "Index")">CSEPT</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    @*<li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>*@
                    <li><a href="@Url.Action("View", "Photo", new { @PhotoID = 0 })">Tag Photo</a></li>
                </ul>
                @*<form class="navbar-form navbar-left" role="search">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search">
                    </div>
                    <button type="submit" class="btn btn-default">Submit</button>
                </form>*@
                
                <ul class="nav navbar-nav navbar-right">
                    @*<li><a href="#">Link</a></li>*@
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> @((Model.isLoggedIn) ? Model.CurrUser.UserName : "Log In")<span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            @if (!Model.isLoggedIn) { 
                                <li>
                                    <form class="navbar-form" action="@Url.Action("Login", "User")" method="post">
                                        <div class="form-group">
                                            <label class="control-label">User name</label>
                                            @Html.TextBox("UserName", "", new {@placeholder = "User Name", @class="form-control"})
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label">Password</label>
                                            @Html.Password("Password", "", new {@placeholder = "User Name", @class="form-control"})
                                        </div>
                                        <div class="">
                                            
                                            <button style="margin-top: 5px" class="btn btn-block btn-primary">Submit</button>
                                        </div>
                                    </form>
                                </li>
                                <li><a class="text-center" href="@Url.Action("Register", "User")">Create Account</a></li>
                            }else{
                                <li><a class="">User Balance: @Model.CurrUser.Credits credits</a></li>
                                <li role="presentation" class="divider"></li>
                                <li><a class="" href="@Url.Action("Index", "User")">My Events and Photos</a></li>
                                <li><a class="" href="@Url.Action("Password", "User")">Change Password</a></li>
                                <li><a class="" href="@Url.Action("Info", "User")">Modify Account</a></li>
                                <li role="presentation" class="divider"></li>
                                <li><a class="" href="@Url.Action("Logout", "User")">Logout</a></li>
                            }

                        </ul>
                    </li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>
    @if (!String.IsNullOrEmpty(Model.PageMessage)) { 
        <div class="alert alert-@Model.PageMessageType alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
            @Html.Raw(Model.PageMessage)
        </div>
    }
    <div class="col-xs-12">
        @RenderBody()
    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="@Url.Content("/js/bootstrap.min.js")"></script>
    <script src="@Url.Content("/js/toastr.min.js")"></script>
    <script src="@Url.Content("/js/bootstrap-datepicker.js")"></script>
    <script>
        $('form').submit(function () {
            var returnVal = true;
            $('.has-error,.has-success').removeClass('has-error has-success');
            $('.required').each(function () {
                var ele = $(this);
                if (ele.val() == '') {
                    ele.parent().addClass('has-error');
                    toastr.error(ele.siblings('label').text() + " cannot be left blank!!");
                    returnVal = false;
                } else {
                    ele.parent().addClass('has-success');
                } 
            });
            return returnVal;
        });
        $('input').keydown(function (_ele) {
            $(this).parent().removeClass('has-error has-success');
        });
    </script>
</body>
</html>